<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2019/4/23
  Time: 20:50
  To change this template use File | Settings | File Templates.
--%>
<%@ page import="JavaBean.User" %>
<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="en">
<head>
    <script src="https://cdn.bootcss.com/jquery/2.2.4/jquery.min.js"></script>
    <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
    <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="css/a.css">
    <style>
        .form{
            background: rgba(255,255,255,0.2);
            width:1200px;
            margin:120px auto;
            padding: 50px;
        }
        #form1{
            background: rgba(255,255,255,0.3);
            width:350px;
            height:150px;
            border-radius: 0;
        }
        #form2{
            background: rgba(255,255,255,0.3);
            width:700px;
            border-radius: 0;
            margin: 0px 30px;
        }
        .mess1{
            width: 310px;
            height: 80px;
            margin: 20px 0px 20px 20px;
            font-size: 13px;
            color: #060406;
        }
        #form3{;
            width:350px;
            border-radius: 0;
        }
        #form4{
            background: rgba(255,255,255,0.3);
            width:350px;
            height: 700px;
            border-radius: 0;
            margin: 30px 0px;
            padding: 20px;
        }
        .hrr{
            height: 1px;
            border: none;
            background-color: #c6c6c0;
        }
    </style>
</head>
<body>
<div class="container">
    <%User user = (User) session.getAttribute("user");%>
    <div class="form row">
        <h1 class="text-center" style="color: #ad98bd; font-size: 45px" >Personal Message</h1>
        <hr>
        <div style="display: flex">
            <div id="form3">
                <div id="form1"  >
                    <a style="height: 25px; margin-right: 0.5em; position: relative;left: 50px"title="用户头像">
                        <div style="display: flex;align-items:flex-end">
                            <img style="height: 150px; width: 150px; position: relative;left:-20px;" src=<%=user.getImg()%>  class="img-circle" >
                            <form action="upload" enctype="multipart/form-data" method="post">
                                <input type="file" name="file"/><br/>
                                <input type="submit" name="upload" value="上传头像"/>
                            </form>
                        </div>
                    </a>
                </div>
                <div id="form4">
                    <h3 style="font-size:20px;color: #ad98bd;"> Message Board</h3>
                    <hr class="hrr">
                </div>
            </div>
            <div id = form2>
                <h3 class="text-center" style="color: #ad98bd;" >User Message</h3>
                <hr class="hrr"style="width: 95%">
                <div style="display:flex;flex-wrap:wrap ">
                    <div class="mess1">学号<hr class="hrr">
                        <p><%=user.getSno()%></p>
                    </div>
                    <div class="mess1">邮箱地址<hr class="hrr">
                        <p><%=user.getEmail()%></p>
                    </div>
                    <div class="mess1">昵称<hr class="hrr">
                        <p><%=user.getName()%></p>
                    </div>
                </div>
                <h3 class="text-center" style="color: #ad98bd;" >Details</h3>
                <hr class="hrr"style="width: 95%">
                <div style="display:flex;flex-wrap:wrap ">
                    <div class="mess1">家庭住址<hr class="hrr"></div>
                    <div class="mess1">学校<hr class="hrr"></div>
                    <div class="mess1">学院<hr class="hrr"></div>
                </div>
                <form action="LogoutServlet" enctype="multipart/form-data" method="post">
                    <input type="submit" name="LogoutServlet" class="btn btn-default" style="position: relative; left:600px;top: 150px;" value="退出"/>
                </form>
            </div>
        </div>
    </div>
</div>
</body>
</html>
